<template>
  <a-upload
    :file-list="fileList"
    name="file"
    action="http://192.168.3.63:38080/tnbs-filesystem/file/upload"
    :headers="headers"
    @preview="preview"
    :data="{store: '2'}"
    @change="handleChange"
    :beforeUpload="beforeUpload"
    :remove="removeFile"
    v-bind="attrs"
  >
    <a-button>
      <!-- <upload-outlined></upload-outlined> -->
      点击上传
    </a-button>
    <div>
      仅支持 .xsx.ssff文件
    </div>
  </a-upload>
</template>

<script>
import { reactive, ref } from '@vue/reactivity'
import { message } from 'ant-design-vue';
export default {
  props: {
    fileList: {
      type: Array,
      default: () => []
    }
  },
  emits: ['update:fileList'],
  setup( props, {attrs, emit, expose, slots}) {

    const removeFile = (a, b ) => {
      // console.log('aaaaaaaaaaaaaaaaaaaaa')
      // console.log(a)
      // console.log(b)
      // console.log(wrapFileList)
    }

    const handleChange = ({file, fileList}) => {

      let resFileList = [...fileList];

      resFileList = resFileList.map(item => {
        let obj = {}
        if(item.response && Number(item.response.code) === 200){
          obj = item.response.body || {}
          obj.uid = item.uid
        }else{
          obj = item
        }

        return {
          name: obj.filename,
          ...obj
        }
      })
      emit('update:fileList', resFileList)

    }

    const preview = (a, b) => {
      // console.log('previeewFile  ====')
      // console.log(a)
      // console.log(b)
    }

    const beforeUpload = (file) => {

      // 验证 文件 大小 单位  MB，  默认为  200 MB
      let { maxSize, accept, limit } = attrs
      !maxSize && (maxSize = window.global_config.fileMaxSize)
      const size = file.size/1024/1024        // 实际大小
      if( size > maxSize ){
        message.warning('上传的文件大小不可超过 ' + maxSize + ' MB');
        return Promise.reject()
      }

      // 上传 文件 类型 校验
      if( accept ){     //   .doc,.docx  这种 各样 格式 ==
        const ext = file.name.substring(file.name.indexOf('.') + 1)
        if( accept.toLocaleLowerCase().indexOf(ext.toLocaleLowerCase()) === -1 ){   // 不 符合 需要的 类型
          message.warning('不可上传该类型文件');
          return Promise.reject()
        }
      }

      if( limit && props.fileList.length >= limit ){
        message.warning('最多上传 ' + limit + ' 个文件');
        return Promise.reject()
      }

      return true
    }

    return {
      handleChange,
      headers: {Authorization: $g.getToken()},
      removeFile,
      preview,
      beforeUpload,
      attrs
    }
  }
}
</script>

<style scoped lang="less">

</style>